<html>
    <head>
        <title>Hours for Interval {{ds1}} to {{ds2}}</title>
        
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('div.levelzero> div').hide();
                $('div.levelzero> h1').click(function() {
                    $(this).next().slideToggle('fast');
                });
                $('div.levelone> div').hide();
                $('div.levelone> h2').click(function() {
                    $(this).next().slideToggle('fast');
                });
                $('div.leveltwo> div').hide();
                $('div.leveltwo> h3').click(function() {
                    $(this).next().slideToggle('fast');
                });
            });
        </script>
        
        <style type="text/css">
        .levelzero {
            width: 1000px;
            margin: 1em .5em;
        }
        .levelzero h1 {
            margin: 0;
            background: #bfc4e5;
            border-top: 3px solid #386785;
            border-bottom: 3px solid #386785;
            padding: .5em
        }
        .levelzero h2 {
            margin: 0;
            background: #85a4d5;
            border-top: 2px solid #386785;
            border-bottom: 2px solid #386785;
            padding: .3em
        }
        .levelzero h3 {
            margin: 0;
            background: #74d3e7;
            border-top: 1px solid #386785;
            border-bottom: 1px solid #386785;
            padding: .2em
        }
        .levelzero p {
            margin: 0;
            background: #bfcdb4;
            border-top: 1px solid #386785;
            border-bottom: 1px solid #386785;
            padding: .25em
        }
        </style>

    </head>

    <body>
        <div class="levelzero">
            <h1>Tasks for Interval {{ds1}} to {{ds2}}<br>{{td2jh(total_hours)}}</h1>
            <div class="levelone">
            {% for assigner in assigners %}
                <h2>{{ td2jh(assigner[1]) }}: {{ assigner[0] }}</h2>
                <div class="leveltwo">
                {% for task in timesort(task_list) if task.assigner == assigner[0] and task.weekHours != zeroHours %}
                    <h3>{{ td2jh(task.weekHours) }}: {{ task.name|title }} </h3>
                    <div>
                        <p>
                            Priority: {{task.priority}}
                                <br>Total Time Spent on Task: {{td2jh(task.timespent)}}
                            {% if not task.iscompleted %}
                                <br>Time Spent So Far: {{td2jh(task.timespent)}}
                                <br>Due in: {{td2d(task.timeTillDue)}}
                                <br>Estimated Time Left: {{td2h(task.timeToGo)}}
                            {% endif %}
                            {% if task.iscompleted %}
                                <br><em>Task Completed</em>
                            {% endif %}
                            <br><br>
                            {{task.description}}
                        </p>
                    </div>
                {% endfor %}
                </div>
            {% endfor %}
            </div>
        </div>
    </body>
</html>
